<template>
  <div class="demo-image__placeholder">
    <el-menu
      :default-active="activeIndex"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
    >
    </el-menu>
    <div class="line"></div>
    <el-menu
      :default-active="activeIndex2"
      class="el-menu-demo"
      mode="horizontal"
      @select="handleSelect"
      background-color="#0092ff"
      text-color="#fff"
      active-text-color="#ffff"
    >
      <el-menu-item></el-menu-item> <el-menu-item></el-menu-item>
      <el-menu-item></el-menu-item> <el-menu-item></el-menu-item>
      <el-menu-item></el-menu-item> <el-menu-item></el-menu-item>
      <el-menu-item index="1">
        <router-link to="/" tag="li" active-class="current">
          首页推荐
        </router-link>
      </el-menu-item>
      <el-menu-item index="9">
        <router-link to="/spike" tag="li" active-class="current">
          商品秒杀区
        </router-link>
      </el-menu-item>
      <el-submenu index="2">
        <template slot="title">商品分类</template>
        <el-menu-item index="2-1">
          <router-link to="/index?key=手机" tag="li" active-class="current">
            手机
          </router-link>
        </el-menu-item>
        <el-menu-item index="2-2"><router-link to="/index?key=家电" tag="li" active-class="current">
            家电
          </router-link></el-menu-item>
        <el-menu-item index="2-3"><router-link to="/index?key=其他" tag="li" active-class="current">
            其他
          </router-link></el-menu-item>
      </el-submenu>
      <el-menu-item index="3"><router-link to="/coupon"  tag="li" active-class="current">优惠卷领取</router-link></el-menu-item>

      <el-menu-item>
        <el-a
          class="el-icon-setting top-ioc"
          @click="drawer = true"
          type="primary"
        >
        </el-a>
      </el-menu-item>
      <el-menu-item>
        <el-input placeholder="请输入查询的商品名" v-model="search" clearable>
        </el-input>
      </el-menu-item>
      <el-menu-item> <router-link :to="'/search?search='+search"  tag="li" active-class="current">搜索</router-link></el-menu-item>
    </el-menu>
    <el-drawer title="我是标题" :visible.sync="drawer" :with-header="false">
      <Login></Login>
    </el-drawer>
  </div>
</template>



<script>
import Login from "@/components/login";
export default {
  components: {
    Login,
  },
  data() {
    return {
      token: window.sessionStorage.getItem("token"),
      lists: [],
      drawer: false,
      activeIndex: "1",
      activeIndex2: "1",
      currentDate: new Date(),
      search: "",
      name: "",
    };
  },
  created() {
    this.lists = ["https://i03piccdn.sogoucdn.com/37c7aff5568041ee"];
    if (!this.token) {
      this.drawer = true;
    }
  },
  methods: {
    handleSelect(key, keyPath) {
      //console.log(key, keyPath);
    },
  },
  created(){
         this.key=this.$route.query.key
 
  },

  
};
</script>

<style>
.top-ioc {
  position: relative;
  margin-right: 10px;
}
.time {
  font-size: 13px;
  color: #999;
}

.bottom {
  margin-top: 13px;
  line-height: 12px;
}
.button {
  padding: 0;
  float: right;
}

.image {
  width: 100%;
  display: block;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}
</style>